{% set uniqid = uniqid ?? uniqid('upstream_') %}
{% set idBase = "nginx-upstreams-#{uniqid}" %}
{% set nameBase = "nginx[upstreams][#{uniqid}]" %}

{% set members = (upstream.members is defined) ? upstream.members : [] %}

<div id="{{ idBase }}" data-uniqid="{{ uniqid }}" data-name="{{ nameBase }}"
     class="tab-pane {{ active is defined and active ? 'active' }}">
    <div class="form-group col-xs-12 col-sm-6">
        <label for="{{ idBase }}-name">
            Name
        </label>
        <input type="text" id="{{ idBase }}-name"
               name="{{ nameBase }}[name]"
               placeholder="backend" class="form-control"
               value="{{ upstream.name }}" />
        <div class="help-block">
            Name of the upstream configuration. You will reference this name in the
            Virtual host proxy configuration as <code>http://{name}</code>
        </div>
    </div>

    <div class="form-group col-xs-12 col-sm-6">
        <label for="{{ idBase }}-upstream_fail_timeout">
            Fail Timeout
        </label>
        <input type="text" id="{{ idBase }}-upstream_fail_timeout"
               name="{{ nameBase }}[upstream_fail_timeout]"
               placeholder="10s" class="form-control"
               value="{{ upstream.upstream_fail_timeout }}" />
        <div class="help-block">
            Time in seconds, example: <code>10s</code>.
        </div>
    </div>

    <div class="clearfix"></div>

    <div class="form-group col-xs-12 col-sm-6">
        <label for="{{ idBase }}-members">
            Members
        </label>
        <select id="{{ idBase }}-members"
                name="{{ nameBase }}[members][]"
                multiple class="form-control select-tags-editable">
            {% for member in members %}
                <option selected value="{{ member }}">{{ member }}</option>
            {% endfor %}
        </select>
        <div class="help-block">
            URL of your proxy servers, must be in format <code>{name}:{port}</code>,
            ex: <code>localhost:3000</code>
        </div>
    </div>

    <div class="clearfix"></div>
</div>
